<template>
    <div class="cinemas" v-if="film">
        <my-head :title="film.name"></my-head>
        <div class="navs">
            <van-tabs v-model="current" sticky color="#ff5f16" title-active-color="#ff5f16">
                <van-tab v-for="(l,i) in showCinemas" :key="i" :title="l.showDate * 1000 | dateFormat" :name="i">
                    <clist :list="cinemas" :filmId="film.filmId" :time="l.showDate"></clist>
                </van-tab>
            </van-tabs>
        </div>
    </div>
</template>

<script>
export default {
    data(){
        return {
            film:null,
            showCinemas:[] , // 当前电影播放的日期列表
            cinemas:[],  // 每一天播放当前的电影的电影院有哪些  
            current:0
        }
    },
    watch:{
        current(v){
            console.log(v)
            this.getcinemas(this.showCinemas[v].cinemaList)
        }
    },
    methods:{
        async getFilmData(){
            let res = await this.$ajax.getMaizuo({
                filmId:this.$route.params.filmId,
            },{
                'X-Host': 'mall.film-ticket.film.info'
            })
            this.film = res.data.film 
        },
        async getshowCinemas(){
            let res = await this.$ajax.getMaizuo({
                filmId:this.$route.params.filmId,
                cityId:this.city.cityId, 
            },{
                'X-Host': 'mall.film-ticket.cinema.film-show-cinema'
            })
            this.showCinemas = res.data.showCinemas;  // 
            this.getcinemas(this.showCinemas[this.current].cinemaList)
        },
        async getcinemas(cinemaList){
            let res = await this.$ajax.postMaizuo({
                cityId:this.city.cityId, 
                cinemaIds:cinemaList.join(",")
            },
            {
                k: 31703
            },
            {
                'X-Host': 'mall.film-ticket.cinema.batch-cinema',
                // 'X-Client-Info': {"a":"3000","ch":"1002","v":"5.2.0","e":"164016685720306605375489","bc":this.city.cityId}
            })

            this.cinemas = res.data.cinemas;
        }
    },
    mounted(){
        this.getFilmData()
        this.getshowCinemas()
    }
}
</script>